WEB基礎の入門（basic）

HTML(Hyper Text Markup Language)はWEBページを作成するための言語である．

1. 基本エレメント「WEBシステム概論」2025 演習例題
   • w0:WEBページの構文
   • w1:ページの基本要素の実装
   • w2:箇条書きリストとテーブル
   • grid1: グリッドシステムでのデザイン
   • grid2:ネストリストをグリッドシステムでのデザイン
   • grid3:イメージパネルをグリッドシステムでのデザイン
   • nav1:navbarとscrollspyとcollapse
   • card1_w & card2: カードパネル(1)
   • card1 & card2: カードパネル(2)
2. 基本エレメント「WEBシステム概論」2022-2023演習例題
• b1: My First Page
• b2: リスト list
• リストマーカーtypeの設定
• b3: ネストリスト Nest list
• b4: テーブル table

CSSとBootstrap 5によるページの装飾(CSS)

CSS（Cascading Style Sheet）はWEBページのスタイルを，所謂ページをどのように装飾するかを指定するための言語である． 「Bootstrap 5」は複雑なHTMLやCSSを記述しなくとも，簡単にWEBページをデザインできるフレームワーク「Bootstrap」の最新版． Bootstrap 5では，これまで依存してきたJavaScriptライブラリのjQueryがついに不要になった．

この節では，cssとBootstrap 5を学び，同時にWEBページのデザインを実践する．

2. CSSの基本
   • c1: CSSによる背景色と文字色(b3の装飾)
   • c2: CSSによる背景に画像を貼り付けるとリストマーカーの非表示(b3の装飾)
   • c3: CSSのクラス（class）セレクター（b4時間割の色彩装飾）
3. Bootstrap 5の基本
• c4: グリッドシステム(grid system)例題1（c2をパネルにする）
• c5: Bootstrap 5の導入とグリッドシステム(grid system)例題2（イメージパネル１）
• c6: グリッドシステム(grid system)例題3（イメージパネル２）
• c7: グリッドシステム(grid system)例題4（イメージをw3カードに書き換え、カードとリストを結合したパネル）
• c8: w3カードの装飾例題５（カードとリストを結合したパネル）